<template>
    <div class="white-box">
        <title-more title="注册送优惠券设置" />
        <pub-panel title="会员注册送优惠券" tip="启用后，新用户首次登录小程序即送优惠券" bottom="20px">
            <template #right>
                <el-switch
                    v-model="switchs"
                    width="72px"
                    size="large"
                    inline-prompt
                    active-text="已开启"
                    inactive-text="已关闭"
                    @change="changeSwitch"
                />
            </template>
        </pub-panel>
        <div class="task-one">
            <div class="task-one__item">
                <span class="task-one__label">选择优惠券：</span>
                <el-select v-model="coupon_id" clearable placeholder="请选择选择优惠券">
                    <el-option :label="item.title" :value="item.coupon_id" v-for="item in coupon_arrs" :key="item.coupon_id" />
                </el-select>
            </div>
            <div class="task-one__btn task-wrap-btn clearfix" style="padding-left: 84px; margin-top: 10px">
                <el-button type="primary" :loading="form_loading" @click="handleConfirm">保存</el-button>
            </div>
        </div>
    </div>
    <go-back />
</template>

<script setup>
import { getCurrentInstance, ref, onMounted } from "vue"
import GoBack from "@components/GoBack.vue"
import TitleMore from "@components/title-more.vue"
import PubPanel from "@components/PubPanel.vue"

const { proxy } = getCurrentInstance()

onMounted(() => {
    getConfig()
})

// 获取配置
const switchs = ref(false)
function getConfig() {
    proxy.$axios
        .get("ump/reward/register", {
            params: {
                action: "config",
            },
        })
        .then((res) => {
            if (res.data.code == 0) {
                let result = res.data.data
                switchs.value = result.register_coupon == 0 ? false : true
                getDetail()
            } else {
                proxy.$message({message:res.data.msg,type:"error"})
            }
        })
        .catch((err) => {})
}
// 设置配置
const changeSwitch = (val) => {
    proxy.$axios
        .get("ump/reward/register", {
            params: {
                action: "config_set",
                field: "register_coupon",
                field_val: val ? 1 : 0,
            },
        })
        .then((res) => {
            if (res.data.code == 0) {
                proxy.$message({ message: "设置成功", type: "success" })
            } else {
                proxy.$message({message:res.data.msg,type:"error"})
            }
        })
        .catch((err) => {})
}

const coupon_id = ref("")
const coupon_arrs = ref([])
function getDetail() {
    proxy.$axios
        .get("ump/reward/register", {
            params: {
                action: "index",
            },
        })
        .then((res) => {
            if (res.data.code == 0) {
                let result = res.data.data
                coupon_arrs.value = result.coupon_list
                coupon_id.value = result.reward != null ? result.reward.coupon_id : ""
            } else {
                proxy.$message({message:res.data.msg,type:"error"})
            }
        })
        .catch((err) => {})
}

const form_loading = ref(false)
const handleConfirm = () => {
    if (!coupon_id.value) {
        proxy.$message({ message: "请选择优惠券", type: "warning" })
        return
    }
    form_loading.value = true
    proxy.$axios
        .get("ump/reward/register", {
            params: {
                action: "update",
                coupon_id: coupon_id.value,
            },
        })
        .then((res) => {
            form_loading.value = false
            if (res.data.code == 0) {
                proxy.$message({ message: "保存成功！", type: "success" })
            } else {
                proxy.$message({message:res.data.msg,type:"error"})
            }
        })
        .catch((err) => {
            form_loading.value = false
        })
}
</script>
<script>
export default {
    name: "CouponGive",
}
</script>

<style lang="less" scoped></style>
